<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="../static/jquery-easyui-1.5.5.3/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="../static/jquery-easyui-1.5.5.3/themes/bootstrap/easyui.css"/>
<link rel="stylesheet" type="text/css" href="../static/jquery-easyui-1.5.5.3/themes/icon.css"/>
<script type="text/javascript" src="../static/jquery-easyui-1.5.5.3/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../static/jquery-easyui-1.5.5.3/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">
$(function(){
	$('#money').numberbox({
		min:0,
		required:true,
		missingMessage:'金额必填',
		precision:2
	});
	
	$("#bt_5").datagrid({
		idField: 'id',
		title: '用户列表',
		width: '100%',
		fitColumns: true,
		striped: true,
		loadMsg: '数据正在加载...',
		rownumbers: true,
		url: 'list',
		frozenColumns: [
			[
				{     
					field: 'ck',
					width: 50,
					checkbox: true
				}
			]
		],
		columns: [
			[
				{
					field: 'number',
					title: '发票号码',
					width: 100,
					align: 'center'
				},{
					field: 'code',
					title: '发票代码',
					width: 150,
					align: 'center'
				},{
					field: 'money',
					title: '金额',
					width: 150,
					align: 'center'
				},{
					field: 'date',
					title: '开票时间',
					width: 150,
					align: 'center'
				},{
					field: 'name',
					title: '报销人',
					width: 150,
					align: 'center'
				},{
					field: 'endDate',
					title: '报销时间',
					width: 150,
					align: 'center'
				},{
					field: 'Unit',
					title: '开票单位',
					width: 100,
					align: 'center',
					formatter: function(value, rec){ 
						return rec.lessee.name;
					}
				},{
					field: 'state',
					title: '状态',
					width: 150,
					align: 'center'
				}
			]
		],
		pagination: true,
		pageSize: 10,
		pageList: [3, 5, 10, 20],
		toolbar: [
			{
				text:'新增电子发票',
				iconCls: 'icon-add',
				handler: function(){
					$('#mydialog').dialog('open');	
				}
			}
		]
	});
	
	$('#bin1').click(function(){
		if($('#myform').form('validate')){
			$.ajax({
				type:'post',
				url:'save',
				cache:false,
				data:$('#myform').serialize(),
				dataType:'json',
				success:function(){
					$('#mydialog').dialog('close');
					$('#bt_5').datagrid('reload');
					$.messager.show({
						title:'ok',
						msg:'保存成功！'
					});
				},
			});
		}else{
			$.messager.show({
				title:'提示信息！',
				msg:'数据验证不通过，不能保存！'
			});
		}
	});
	$('#bin2').click(function(){
		$('#mydialog').dialog('close');
	});
});
</script>
</head>
<body>
	<table id="bt_5"></table>
	<div id="mydialog" title="新增电子发票"  draggable=false class="easyui-dialog" closed=true>
		<form id="myform" action="invoice/add" method="post">
			<table>
				<tr>
					<td>金额：</td>
					<td><input id="money" name="money" type="text" placeholder="金额" style="width: 105px;"></td>
				</tr>
				<tr>
					<td>选择租户：</td>
					<td>
						<select name="lessee">
			                <option th:each="c:${lessee}" th:value="${c.id}" th:text='${c.name}'></option>
			            </select>
			        </td>
				</tr>
				<tr align="center">
					<td colspan="2">
						<a id="bin1" style="margin-left: 20px;" class="easyui-linkbutton">保存</a>
						<a id="bin2" style="margin-left: 10px;" class="easyui-linkbutton">关闭</a>
					</td>
				</tr>
			</table>
		</form>
	</div>
</body>
</html>